import '../lib/jquery.js'
import { ajax } from '../utils/ajax.js'
// 导入用户名与密码正则校验
import { nameTest, pwdTest } from '../utils/reg.js'

// 预先选择DOM元素以避免多次选择
const $form = $('form');
const $error = $('.error');
const $username = $('.username');
const $password = $('.password');

// 封装显示错误信息的函数
function showError(message) {
  $error.text(message); // 使用.text()代替.html()以避免HTML注入风险
  $error.css('display', 'block');
}

// 当表单提交时
$form.on('submit', async e => {
  e.preventDefault();

  // 获取参数
  const username = $username.val();
  const password = $password.val();

  // 校验输入是否为空
  if (!username || !password) {
    return showError('表单不能为空');
  }

  // 用户名格式验证
  if (!nameTest(username)) {
    return showError('用户名格式错误');
  }

  // 密码格式验证
  if (!pwdTest(password)) {
    return showError('密码格式错误');
  }

  try {
    // 发起POST请求进行登录
    const response = await ajax.post('/users/login', { username, password });
    const { code, token, user } = response.data;

    // 登录失败，显示错误信息
    if (code !== 1) {
      return showError('登录失败');
    }

    // 登录成功，保存token和用户ID
    localStorage.setItem('token', token);
    localStorage.setItem('uid', user.id);

    // 跳转到主页
    location.href = './index.html';
  } catch (error) {
    // 网络请求失败时显示错误信息
    console.error('Login error:', error);
    showError('登录时发生错误');
  }
});